<!doctype html>
<html>
<head>
    {% load static %}
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap.min.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'architecture/css/style.css' %}">
    <script src="{% static 'js/jquery-3.3.1.min.js' %}"></script>
    <script src="{% static 'js/bootstrap.min.js' %}"></script>
    <script src="{% static 'architecture/js/style.js' %}"></script>
    <title>Document</title>
</head>
<body>
    <div class="header">
            <ul>
                <li class="nav_title">
                    <a href="HomePage.html">Campus Survival Guide</a>
                    —— Homepage
                </li>
{#                <li>|</li>#}
{#                <li class="nav_left">#}
{#                    <a href="Building.html">Building</a>#}
{#                </li>#}
{#                <li>|</li>#}
{#                <li class="nav_left">#}
{#                    <a href="Activity.html">Activity</a>#}
{#                </li>#}
{#                <li>|</li>#}
{#                <li class="nav_left">#}
{#                    <a href="Learning.html">Learning</a>#}
{#                </li>#}
{#                <li>|</li>#}
{#                <li class="nav_left">#}
{#                    <a href="Blog.html">Blog</a>#}
{#                </li>#}
{#                <li>|</li>#}
{#                <!--退出返回主界面-->#}
                <li class="nav_right" style="float:right">
                    <a href="{% url 'home:index' %}">Back</a>
                </li>
            </ul>
        </div>

    <div class="container" style="width: 60%;margin-top:10px">
        <div class="row">
                当前位置:{{ architecture }}
        </div>
        <div class="row">
            <div class="line"></div>
        </div>

        <div class="row">
            <div class="col-md-3 left">
                  <ul class="list-group">
                     {% if architecture == '建筑' %}
                        <li class="list-group-item active">建筑</li>
                     {% else %}
                        <li class="list-group-item">建筑</li>
                     {% endif %}
                     {% if architecture == '活动' %}
                        <li class="list-group-item active">活动</li>
                     {% else %}
                        <li class="list-group-item">活动</li>
                     {% endif %}
                     {% if architecture == '学习' %}
                        <li class="list-group-item active">学习</li>
                     {% else %}
                        <li class="list-group-item">学习</li>
                     {% endif %}
                     {% if architecture == '博客' %}
                        <li class="list-group-item active">博客</li>
                     {% else %}
                        <li class="list-group-item">博客</li>
                     {% endif %}
                  </ul>
            </div>
            <div class="col-md-9 right">
                <ul class="list-group">
                    <li class="list-group-item active">当前分类下的词条</li>
                    <li class="list-group-item">
                        <div class="title">
                            <dt>我是标题</dt>
                        </div>
                        <div class="detail">
                            <span>词条创建人:xxx</span>
                            <span>创建时间:xxx</span>
                        </div>
                        <div class="content">

                            <dd>主要内容:饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发我饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发芠呼我阿尔法猴王和乌尔回复</dd>
                        </div>
                    </li>
                    <li class="list-group-item">
                        <div class="title">
                            <dt>我是标题</dt>
                        </div>
                        <div class="detail">
                            <span>词条创建人:xxx</span>
                            <span>创建时间:xxx</span>
                        </div>
                        <div class="content">

                            <dd>主要内容:饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发我饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发芠呼我阿尔法猴王和乌尔回复</dd>
                        </div>
                    </li>
                                        <li class="list-group-item">
                        <div class="title">
                            <dt>我是标题</dt>
                        </div>
                        <div class="detail">
                            <span>词条创建人:xxx</span>
                            <span>创建时间:xxx</span>
                        </div>
                        <div class="content">

                            <dd>主要内容:饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发我饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发芠呼我阿尔法猴王和乌尔回复</dd>
                        </div>
                    </li>                    <li class="list-group-item">
                        <div class="title">
                            <dt>我是标题</dt>
                        </div>
                        <div class="detail">
                            <span>词条创建人:xxx</span>
                            <span>创建时间:xxx</span>
                        </div>
                        <div class="content">

                            <dd>主要内容:饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发我饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发芠呼我阿尔法猴王和乌尔回复</dd>
                        </div>
                    </li>
                                        <li class="list-group-item">
                        <div class="title">
                            <dt>我是标题</dt>
                        </div>
                        <div class="detail">
                            <span>词条创建人:xxx</span>
                            <span>创建时间:xxx</span>
                        </div>
                        <div class="content">

                            <dd>主要内容:饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发我饿否我和否瓦恶风罕沃尔复合瓦尔违法和瓦偶尔违反虎娃偶尔发芠呼我阿尔法猴王和乌尔回复</dd>
                        </div>
                    </li>
                  </ul>
            </div>
        </div>
    </div>

</div>
</body>
</html>